<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>云API</title>
    <link rel="stylesheet" type="text/css" href="../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../css/style.css" />
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../script/bootstrap-3.3.7-dist/css/bootstrap.min.css" />
    <style>
        .empty {
            text-align: center;
            padding: 120px 0;
        }

        div.input-group input {
            border: 1px solid #ccc;
            border-radius: 4px
        }

        div.mydiv label {
            font-size: 19px
        }

        div.mydiv button {
            width: 88px;
            height: 45px
        }
    </style>
</head>

<body>
    <div id="app">
  <div class="aui-card-list">
      <div class="aui-card-list-header aui-card-list-user aui-border-b">
          <div class="aui-card-list-user-avatar">
              <img src="../image/demo4.png" class="aui-img-round" />
          </div>
          <div class="aui-card-list-user-name">
              <div>{{user.username}}</div>
              <small>{{user.usercreatetime}}</small>
          </div>
          <div class="aui-card-list-user-info"></div>
      </div>
      <div class="aui-card-list-content-padded">
          <img src="../image/l2.png" />
      </div>
      <div class="aui-card-list-footer aui-border-t">
          <!-- <div><i class="aui-iconfont aui-icon-note"></i> 666</div>
          <div><i class="aui-iconfont aui-icon-laud"></i> 888</div>
          <div><i class="aui-iconfont aui-icon-star"></i> 888</div> -->
      </div>

  </div>
  <div class="mydiv">
  <div class="input-group">
    <span id='span1' class="input-group-addon">题目数量</span>
    <input v-model="num" style="height:28px;" id="input1" type="number" class="form-control" min="0" placeholder="请输入数字" aria-describedby="basic-addon1">

  </div>
  <div class="radio">
    <label>
      选择考试时间
    </label>
    <br/>
     <label>
       <input type="radio" v-model="time" value="1" name="radio1"> 1小时
     </label>
     <label>
       <input type="radio" v-model="time" value="2" name="radio1"> 2小时
     </label>
     <label>
       <input type="radio" v-model="time" value="3" name="radio1"> 3小时
     </label>
     <label>
       <input type="radio" v-model="time" value="4" name="radio1"> 4小时
     </label>
   </div>
   <br/>
   <label class="radio-inline">
     <button @click="postPaper" type="button" class="btn btn-success">产生试卷</button>
   </label>

  </div>
</div>
    <script type="text/javascript" src="../script/api.js"></script>
    <script type="text/javascript" src="../script/vue.js"></script>
    <script type="text/javascript" src="../script/jquery-1.12.4.min.js"></script>
    <script type="text/javascript" src="../layer/layer.js"></script>
    <script type="text/javascript" src="../script/init.js"></script>
    <script type="text/javascript">

        var user = JSON.parse(localStorage.getItem('user'))
        var app00 = new Vue({
            el: '#app',
            data: {
                num: 0,
                time: 0,
                user:user

            },
            created: function () {
            },
            methods: {
                postPaper() {
                    $.ajax({
                        url: bashUrl + `paper/${user.userid}/${this.num}/${this.time}`,
                        type: "POST",
                        data: "",
                        timeout: 3000,
                        dataType: "json",
                        success: function (data) {
                          if(data.meg === "1"){
                            api.toast({
                                msg: '增加试卷成功，请到查看页',
                                duration: 2000
                            });

                          }else{
                            api.toast({
                                msg: '增加失败',
                                duration: 2000
                            });
                          }
                        },
                        error: function() {
                            api.toast({
                                msg: "登录失败,请求超时或繁忙",
                                duration: 2000
                            })
                        }
                    });
                }
            }
        })


        apiready = function() {
          // api.addEventListener({
          //     name:'viewappear'
          // }, function(ret, err){
          //    alert('window显示');
          // });

            //     $api.fixStatusBar( $api.dom('header') );
            //     api.setStatusBarStyle({
            //         style: 'dark',
            //         color: '#6ab494'
            //     });
            //     funIniGroup();
            // }
            //
            // function funIniGroup(){
            //     var eHeaderLis = $api.domAll('header li'),
            //         frames = [];
            //     for (var i = 0,len = eHeaderLis.length; i < len; i++) {
            //             frames.push( {
            //                 name: 'frame'+i,
            //                 url: './html/frame'+i+'.html',
            //                 bgColor : 'rgba(0,0,0,.2)',
            //                 bounces:true
            //             } )
            //     }
            //     api.openFrameGroup({
            //         name: 'group',
            //         scrollEnabled: true,
            //         rect: {
            //             x: 0,
            //             y: $api.dom('header').offsetHeight,
            //             w: api.winWidth,
            //             h: $api.dom('#main').offsetHeight
            //         },
            //         index: 0,
            //         frames: frames
            //     }, function (ret, err) {
            //
            //     });
            // }
            //
            // // 随意切换按钮
            // function randomSwitchBtn( tag ) {
            //     if( tag == $api.dom('#footer li.active') )return;
            //     var eFootLis = $api.domAll('#footer li'),
            //         eHeaderLis = $api.domAll('header li'),
            //         index = 0;
            //     for (var i = 0,len = eFootLis.length; i < len; i++) {
            //         if( tag == eFootLis[i] ){
            //             index = i;
            //         }else{
            //             $api.removeCls(eFootLis[i], 'active');
            //             $api.removeCls(eHeaderLis[i], 'active');
            //         }
            //     }
            //     $api.addCls( eFootLis[index], 'active');
            //     $api.addCls( eHeaderLis[index], 'active');
            //     api.setFrameGroupIndex({
            //         name: 'group',
            //         index: index
            //     });
        }
    </script>
</body>

</html>
